<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Migrating from other containers to GtkGrid: GTK+ 3 Reference Manual</title>
<meta name="generator" content="DocBook XSL Stylesheets Vsnapshot">
<link rel="home" href="index.html" title="GTK+ 3 Reference Manual">
<link rel="up" href="migrating.html" title="Part V. Migrating from Previous Versions of GTK+">
<link rel="prev" href="gtk-migrating-smclient-GtkApplication.html" title="Migrating from EggSMClient to GtkApplication">
<link rel="next" href="ch30s02.html" title="GtkBox versus GtkGrid: sizing">
<meta name="generator" content="GTK-Doc V1.33.1 (XML mode)">
<link rel="stylesheet" href="style.css" type="text/css">
</head>
<body bgcolor="white" text="black" link="#0000FF" vlink="#840084" alink="#0000FF">
<table class="navigation" id="top" width="100%" summary="Navigation header" cellpadding="2" cellspacing="5"><tr valign="middle">
<td width="100%" align="left" class="shortcuts"></td>
<td><a accesskey="h" href="index.html"><img src="home.png" width="16" height="16" border="0" alt="Home"></a></td>
<td><a accesskey="u" href="migrating.html"><img src="up.png" width="16" height="16" border="0" alt="Up"></a></td>
<td><a accesskey="p" href="gtk-migrating-smclient-GtkApplication.html"><img src="left.png" width="16" height="16" border="0" alt="Prev"></a></td>
<td><a accesskey="n" href="ch30s02.html"><img src="right.png" width="16" height="16" border="0" alt="Next"></a></td>
</tr></table>
<div class="chapter">
<div class="titlepage"><div><div><h2 class="title">
<a name="gtk-migrating-GtkGrid"></a>Migrating from other containers to GtkGrid</h2></div></div></div>
<div class="toc"><dl class="toc">
<dt><span class="section"><a href="gtk-migrating-GtkGrid.html#id-1.6.7.4">GtkBox versus GtkGrid: packing</a></span></dt>
<dt><span class="section"><a href="ch30s02.html">GtkBox versus GtkGrid: sizing</a></span></dt>
<dt><span class="section"><a href="ch30s03.html">GtkBox versus GtkGrid: spacing</a></span></dt>
</dl></div>
<p>
    <a class="link" href="GtkGrid.html" title="GtkGrid"><span class="type">GtkGrid</span></a> is an attempt to write a comprehensive, legacy-free,
    box-layout container that is flexible enough to replace <a class="link" href="GtkBox.html" title="GtkBox"><span class="type">GtkBox</span></a>,
    <a class="link" href="GtkTable.html" title="GtkTable"><span class="type">GtkTable</span></a> and the like.
  </p>
<p>
    The layout model of GtkGrid is to arrange its children in rows and
    columns. This is done by assigning positions on a two-dimentions
    grid that stretches arbitrarily far in all directions.
    Children can span multiple rows or columns, too.
 </p>
<div class="section">
<div class="titlepage"><div><div><h2 class="title" style="clear: both">
<a name="id-1.6.7.4"></a>GtkBox versus GtkGrid: packing</h2></div></div></div>
<p>
      GtkBox works by arranging child widgets in a single line, either
      horizontally or vertically. It allows packing children from the
      beginning or end, using <a class="link" href="GtkBox.html#gtk-box-pack-start" title="gtk_box_pack_start ()"><code class="function">gtk_box_pack_start()</code></a> and <a class="link" href="GtkBox.html#gtk-box-pack-end" title="gtk_box_pack_end ()"><code class="function">gtk_box_pack_end()</code></a>.
    </p>
<img src="box-packing.png"><div class="example">
<a name="id-1.6.7.4.4"></a><p class="title"><b>Example 53. A simple box</b></p>
<div class="example-contents">
<pre class="programlisting">
  box = gtk_box_new (GTK_ORIENTATION_HORIZONTAL, 0);

  gtk_box_pack_start (GTK_BOX (box), gtk_label_new ("One"), FALSE, FALSE, 0);
  gtk_box_pack_start (GTK_BOX (box), gtk_label_new ("Two"), FALSE, FALSE, 0);
    </pre>
<p>This can be done with <a class="link" href="GtkGrid.html" title="GtkGrid"><span class="type">GtkGrid</span></a> as follows:</p>
<pre class="programlisting">
  grid = gtk_grid_new ();

  child1 = gtk_label_new ("One");
  gtk_grid_attach (GTK_GRID (grid), child1, 0, 0, 1, 1);
  child2 = gtk_label_new ("Two");
  gtk_grid_attach_next_to (GTK_GRID (grid), child2, child1, GTK_POS_RIGHT, 1, 1);
    </pre>
<p>
      And similarly for <a class="link" href="GtkBox.html#gtk-box-pack-end" title="gtk_box_pack_end ()"><code class="function">gtk_box_pack_end()</code></a>. In that case, you
      would use <a class="link" href="gtk3-Standard-Enumerations.html#GTK-POS-LEFT:CAPS"><span class="type">GTK_POS_LEFT</span></a> to place the grid children from
      left to right.
    </p>
<p>
      If you only need to pack children from the start, using
      <a class="link" href="GtkContainer.html#gtk-container-add" title="gtk_container_add ()"><code class="function">gtk_container_add()</code></a> is an even simpler alternative. GtkGrid
      places children added with <a class="link" href="GtkContainer.html#gtk-container-add" title="gtk_container_add ()"><code class="function">gtk_container_add()</code></a> in a single
      row or column according to its <a class="link" href="gtk3-Orientable.html#GtkOrientable--orientation" title="The “orientation” property"><span class="type">“orientation”</span></a>.
    </p>
</div>
</div>
<br class="example-break"><p>
      One difference to keep in mind is that the gtk_box_pack_start/pack_end
      functions allow you to place an arbitrary number of children from
      either end without ever 'colliding in the middle'. With GtkGrid, you
      have to leave enough space between the two ends, if you want to combine
      packing from both ends towards the middle. In practice, this should be
      easy to avoid; and GtkGrid simply ignores entirely empty rows or
      columns for layout and spacing.
    </p>
<p>
      On the other hand, GtkGrid is more flexible in that its grid extends
      indefinitively in both directions — there is no problem with
      using negative numbers for the grid positions. So, if you discover
      that you need to place a widget before your existing arrangement,
      you always can.
    </p>
</div>
</div>
<div class="footer">
<hr>Generated by GTK-Doc V1.33.1</div>
</body>
</html>